<div class="default-background">
  <h2 class="flex-row-space-between">{{'AUTH_CENTER' |translate}} / {{'REGISTRY_STATUS' |translate}}</h2>
  <table mat-table [dataSource]="dataSource">
    <ng-container matColumnDef="id">
      <th mat-header-cell *matHeaderCellDef> {{'ID'|translate}} </th>
      <td mat-cell *matCellDef="let row">
        {{row.id}}
      </td>
    </ng-container>
    <ng-container matColumnDef="name">
      <th mat-header-cell *matHeaderCellDef> {{'NAME'|translate}} </th>
      <td mat-cell *matCellDef="let row">
        {{row.name}}
      </td>
    </ng-container>
    <ng-container matColumnDef="count">
      <th mat-header-cell *matHeaderCellDef> {{'INSTANCE_COUNT'|translate}} </th>
      <td mat-cell *matCellDef="let row">
        {{row.count}}
      </td>
    </ng-container>
    <tr mat-header-row *matHeaderRowDef="displayedColumns; sticky: true"></tr>
    <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
  </table>
</div>